<template>
	<view class="index_wrap">
		<view class="repair-wrap">
			<view v-if="repairList.length === 0">
				<view style="width: 232px;height: 242px;margin: 0px auto;">
					<image style="width: 100%;height: 100%;margin-top: 100px;" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/zanwushuju.png"
						mode=""></image>
				</view>
				<view style="width: 62%;margin: 122px auto;text-align: center;color: #999;">暂无数据</view>
			</view>
			<view>
				<view style="background-color: #FFFFFF;margin-top: 16px;" v-for="(item,index) in repairList">
					<view>
						<view class="header-li" @click="navTo('/my/information/familyDetail',item)">
							<view style="margin-left: 6px;margin-top: 10px;display:flex">
								<image style="width:15px;height:20px;margin-right: 6rpx;"
									src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/family.png" mode=""></image>
								<h3>{{item.hous_user_name}}</h3>
							</view>
							<view style="margin-left: 6px;margin-top: 10px;margin-bottom: 10px;">
								与业主关系：{{item.family_type}}
							</view>
							<view style="margin-left: 6px;margin-top: 10px;margin-bottom: 10px;">
								电话：{{item.hous_phone}}
							</view>
						</view>
					</view>
				</view>
			</view>
			<view style="height: 45px;position: fixed;right: 50rpx;bottom: 150px;">
				<image @click="navToAdd()" style="width: 40px;height: 40px;" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/tenAddDatas.png">
				</image>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

				index: 0,
				type: 1,
				array: ['分类', '分类二'],
				ruleForm: {
					renType: null,
				},
				form: {
					manual_position: null, //手册位置:1.后台系统，2.员工端APP，3.业主单APP
					manual_typename: null, //手册分类名称
					names: null, //搜索
				},
				repairList: [], //用户列表
				pageIndex: 1,
				loading: false,
				// type: 1,
				nextPage: false,
				listData: [],
			}
		},
		onLoad() {
			// this.bol = !this.bol
		},
		onShow() {
			this.homelist = uni.getStorageSync('hourseList')[uni.getStorageSync('hourseNum') || 0]
			this.checkLogin();
		},
		onPullDownRefresh() {
			this.homelist = uni.getStorageSync('hourseList')[uni.getStorageSync('hourseNum') || 0]
			this.checkLogin();
		},
		methods: {
			// 验证是否登录或实名认证
			checkLogin() {
				let _this = this
				if (uni.getStorageSync('phone')) {
					if (uni.getStorageSync('loginFlag')) {
						if (!uni.getStorageSync('hourseList')) {
							uni.showModal({
								title: '请先进行业主认证',
								showCancel: false,
								confirmText: '确认',
								confirmColor: '#F9A832',
								success: function(res) {
									if (res.confirm) {
										_this.$Router.push({
											path: '/my/address/address'
										})
									}
								}
							});
							this.$openInvite()
						} else {
							_this.showFlag = true
							_this.homelist = uni.getStorageSync('hourseList')[uni.getStorageSync('hourseNum') || 0]
							_this.name = _this.homelist.proName;
							_this.address = _this.homelist.buildDistrictCode + '-' + _this.homelist.buildTowerCode + '-' +
								_this.homelist.roomUnitNumber + '-' + _this.homelist.roomCode
							_this.getList()
						}
					} else {
						uni.showModal({
							title: '请先实名认证',
							showCancel: false,
							confirmText: '确认',
							confirmColor: '#F9A832',
							success: function(res) {
								if (res.confirm) {
									_this.$Router.push({
										path: '/homePage1/realName/realName'
									})
								}
							}
						});
					}
				} else {
					uni.showModal({
						title: '请先登录',
						showCancel: false,
						confirmText: '确认',
						confirmColor: '#F9A832',
						success: function(res) {
							if (res.confirm) {
								console.log('a')
								_this.$Router.pushTab({
									path: '/pages/user/user'
								})
							}
						}
					});
				}
				uni.stopPullDownRefresh()

			},
			// 获取列表
			getList() {
				console.log(this.pageIndex, 'pageindex')
				if (this.pageIndex < 2) {
					uni.showLoading({
						title: '加载中'
					});
				}
				this.loading = false;
				this.$request.api.getFamily({
					pageIndex: 1, //页数
					// room_id: 49193, //根据房间room_id查询
					room_id: this.homelist.roomId, //根据房间room_id查询
				}).then(res => {
					console.log(res)
					if (this.pageIndex == 1) {
						this.repairList = res.data.data.datalist || [];
					} else {
						this.repairList = [...this.repairList, ...res.data.data.datalist];
					}
					console.log(this.repairList)
					this.nextPage = res.data.data.isEndPage
					this.loading = true;
					uni.hideLoading();
				})
				console.log(this.nextPage)
			},
			navTo(url, item) {
				let items = encodeURIComponent(JSON.stringify(item))
				uni.navigateTo({
					url: url + '?item=' + items
				});
			},
			checked(index) {
				this.isActive = index
			},
			shouList() {
				this.indexList = !this.indexList
			},
			navToAdd() {
				uni.navigateTo({
					url: '/my/information/fFamilyinformation'
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.index_wrap {
		padding: 0 50rpx;
		box-sizing: border-box;
	}
	.header-li {
		padding-top: 10rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #333333;
		border-bottom: 1rpx solid #EEEEEE;
	}
	.header-li i {
		width: 6px;
		height: 16px;
		background: linear-gradient(180deg, #76D904 0%, #417505 100%);
		border-radius: 4px;
		display: inline-block;
		vertical-align: middle;
		margin-top: 20px;
	}
	.header-name {
		width: 186rpx;
	}
	.search {
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 28rpx;
		color: #427705;
		height: 100rpx;
		border-bottom: 1rpx solid #eeeeee;
		position: relative;
		.search-clear {
			width: 36rpx;
			height: 36rpx;
			position: absolute;
			left: 560rpx;
			top: 50%;
			transform: translateY(-50%);
		}
		.search-input {
			width: 613rpx;
			height: 66rpx;
			background: #f0f2f5;
			border-radius: 33rpx;
			line-height: 66rpx;
			font-size: 28rpx;
			padding: 0 33rpx;
			color: #333333;
			border: 1px solid #427705;
			box-sizing: border-box;
		}
	}
</style>